<template>
  <div class="key-project-temp">
    <div class="top">
      <span style="display: flex;align-items: center;">
        <img style="width: 26px;height: 22px; margin:0 5px" :src="topImg" alt="img" />
        <span style="font-size: 22px; font-weight: bold">{{ projectName }}</span>
      </span>
      <el-button size="small" type="primary" @click="goBack" style="width: 80px;">返回</el-button>
    </div>
    <div class="form-box" :style="{ height: `${formBoxHeight}px` }">
      <div class="grid-title">基本信息</div>
      <el-form :model="formInfo" ref="formInfo" label-position="top" size="mini" :rules="rules">
        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="项目名称：" prop="projectName">
              <el-input v-model="formInfo.projectName" placeholder="项目名称"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="包联领导：" prop="projectLeader">
              <el-input v-model="formInfo.projectLeader" placeholder="包联领导"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="牵头部门：" prop="leadingDepartment">
              <el-input v-model="formInfo.leadingDepartment" placeholder="牵头部门"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="投资主体：" prop="investmentEntity">
              <el-input v-model="formInfo.investmentEntity" placeholder="投资主体"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="总投资：" prop="totalMoney">
              <el-input v-model="formInfo.totalMoney" placeholder="总投资"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="占地面积：" prop="floorSpace">
              <el-input v-model="formInfo.floorSpace" placeholder="占地面积"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="项目介绍：" prop="projectIntroduce">
              <el-input v-model="formInfo.projectIntroduce" placeholder="项目介绍"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="建设地址：" prop="constructionAddress">
              <el-input v-model="formInfo.constructionAddress" placeholder="建设地址"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="政策诉求：" prop="policyStatement">
              <el-input v-model="formInfo.policyStatement" placeholder="政策诉求"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="投资承诺：" prop="investmentCommitment">
              <el-input v-model="formInfo.investmentCommitment" placeholder="投资承诺"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="项目进展：" prop="projectProgress">
              <el-input v-model="formInfo.projectProgress" type="textarea" :rows="2" placeholder="项目进展"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <div class="grid-title">项目阶段</div>
        <el-row :gutter="20">
          <!-- 洽谈 -->
          <el-col :span="8">
            <el-form-item label="洽谈阶段开始时间：" prop="startTime">
              <el-date-picker v-model="formInfo.tProjectFlows[0].startTime" type="date" placeholder="选择日期"
                value-format="yyyy-MM-dd">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="洽谈阶段结束时间：" prop="endTime">
              <el-date-picker v-model="formInfo.tProjectFlows[0].endTime" type="date" placeholder="选择日期"
                value-format="yyyy-MM-dd">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="是否存在堵点：">
              <el-select v-model="formInfo.isPoint1" placeholder="请选择" @change="changeOne">
                <el-option label="是" value="yes"></el-option>
                <el-option label="否" value="no"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <div v-if="formInfo.tProjectFlows[0].tProjectFlowStopList &&
            formInfo.tProjectFlows[0].tProjectFlowStopList.length > 0
            " class="point-box">
            <el-button size="small" style="margin-top: 10px" type="primary" @click="addPoint('1')">新增堵点</el-button>
            <el-row v-for="(item, index) in formInfo.tProjectFlows[0]
              .tProjectFlowStopList" :key="`row${index}`" class="point-box-item" :gutter="20">
              <el-col :span="24">
                <el-form-item prop="content">
                  <div slot="label" class="form-point-label">
                    <span>{{ `赌点${index + 1}` }}</span>
                    <span @click="removePoint('1', index)" class="delete-point"><i class="el-icon-delete"></i>删除</span>
                  </div>
                  <el-input v-model="item.content" placeholder="赌点"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="推进要求：" prop="requirements">
                  <el-input v-model="item.requirements" placeholder="推进要求"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="责任部门：" prop="department">
                  <el-input v-model="item.department" placeholder="责任部门"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="完成时限：" prop="successTime">
                  <el-date-picker type="date" v-model="item.successTime" placeholder="选择日期" value-format="yyyy-MM-dd">
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>
          </div>
          <!-- 洽谈end -->
          <!-- 签约 -->
          <el-col :span="8">
            <el-form-item label="签约阶段开始时间：" prop="startTime">
              <el-date-picker v-model="formInfo.tProjectFlows[1].startTime" type="date" placeholder="选择日期"
                value-format="yyyy-MM-dd">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="签约阶段结束时间：" prop="endTime">
              <el-date-picker v-model="formInfo.tProjectFlows[1].endTime" type="date" placeholder="选择日期"
                value-format="yyyy-MM-dd">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="是否存在堵点：" prop="isPoint2">
              <el-select v-model="formInfo.isPoint2" placeholder="请选择" @change="changeTwo">
                <el-option label="是" value="yes"></el-option>
                <el-option label="否" value="no"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <div v-if="formInfo.tProjectFlows[1].tProjectFlowStopList &&
            formInfo.tProjectFlows[1].tProjectFlowStopList.length > 0
            " class="point-box">
            <el-button size="small" style="margin-top: 10px" type="primary" @click="addPoint('2')">新增堵点</el-button>
            <el-row v-for="(item, index) in formInfo.tProjectFlows[1]
              .tProjectFlowStopList" :key="`row${index}`" class="point-box-item" :gutter="20">
              <el-col :span="24">
                <el-form-item prop="content">
                  <div slot="label" class="form-point-label">
                    <span>{{ `赌点${index + 1}` }}</span>
                    <span @click="removePoint('2', index)" class="delete-point"><i class="el-icon-delete"></i>删除</span>
                  </div>
                  <el-input v-model="item.content" placeholder="赌点"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="推进要求：" prop="requirements">
                  <el-input v-model="item.requirements" placeholder="推进要求"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="责任部门：" prop="department">
                  <el-input v-model="item.department" placeholder="责任部门"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="完成时限：" prop="successTime">
                  <el-date-picker type="date" v-model="item.successTime" placeholder="选择日期" value-format="yyyy-MM-dd">
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>
          </div>
          <!-- 签约end -->
          <!-- 土地手续 -->
          <el-col :span="8">
            <el-form-item label="土地手续阶段开始时间：" prop="startTime">
              <el-date-picker v-model="formInfo.tProjectFlows[2].startTime" type="date" placeholder="选择日期"
                value-format="yyyy-MM-dd">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="土地手续阶段结束时间：" prop="endTime">
              <el-date-picker v-model="formInfo.tProjectFlows[2].endTime" type="date" placeholder="选择日期"
                value-format="yyyy-MM-dd">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="是否存在堵点：" prop="isPoint3">
              <el-select v-model="formInfo.isPoint3" placeholder="请选择" @change="changeThree">
                <el-option label="是" value="yes"></el-option>
                <el-option label="否" value="no"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <div v-if="formInfo.tProjectFlows[2].tProjectFlowStopList &&
            formInfo.tProjectFlows[2].tProjectFlowStopList.length > 0
            " class="point-box">
            <el-button size="small" style="margin-top: 10px" type="primary" @click="addPoint('3')">新增堵点</el-button>
            <el-row v-for="(item, index) in formInfo.tProjectFlows[2]
              .tProjectFlowStopList" :key="`row${index}`" class="point-box-item" :gutter="20">
              <el-col :span="24">
                <el-form-item prop="content">
                  <div slot="label" class="form-point-label">
                    <span>{{ `赌点${index + 1}` }}</span>
                    <span @click="removePoint('3', index)" class="delete-point"><i class="el-icon-delete"></i>删除</span>
                  </div>
                  <el-input v-model="item.content" placeholder="赌点"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="推进要求：" prop="requirements">
                  <el-input v-model="item.requirements" placeholder="推进要求"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="责任部门：" prop="department">
                  <el-input v-model="item.department" placeholder="责任部门"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="完成时限：" prop="successTime">
                  <el-date-picker type="date" v-model="item.successTime" placeholder="选择日期" value-format="yyyy-MM-dd">
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>
          </div>
          <!-- 土地手续end -->
          <!-- 立项审批 -->
          <el-col :span="8">
            <el-form-item label="立项审批阶段开始时间：" prop="startTime">
              <el-date-picker v-model="formInfo.tProjectFlows[3].startTime" type="date" placeholder="选择日期"
                value-format="yyyy-MM-dd">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="立项审批阶段结束时间：" prop="endTime">
              <el-date-picker v-model="formInfo.tProjectFlows[3].endTime" type="date" placeholder="选择日期"
                value-format="yyyy-MM-dd">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="是否存在堵点：" prop="isPoint4">
              <el-select v-model="formInfo.isPoint4" placeholder="请选择" @change="changeFour">
                <el-option label="是" value="yes"></el-option>
                <el-option label="否" value="no"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <div v-if="formInfo.tProjectFlows[3].tProjectFlowStopList &&
            formInfo.tProjectFlows[3].tProjectFlowStopList.length > 0
            " class="point-box">
            <el-button size="small" style="margin-top: 10px" type="primary" @click="addPoint('4')">新增堵点</el-button>
            <el-row v-for="(item, index) in formInfo.tProjectFlows[3]
              .tProjectFlowStopList" :key="`row${index}`" class="point-box-item" :gutter="20">
              <el-col :span="24">
                <el-form-item prop="content">
                  <div slot="label" class="form-point-label">
                    <span>{{ `赌点${index + 1}` }}</span>
                    <span @click="removePoint('4', index)" class="delete-point"><i class="el-icon-delete"></i>删除</span>
                  </div>
                  <el-input v-model="item.content" placeholder="赌点"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="推进要求：" prop="requirements">
                  <el-input v-model="item.requirements" placeholder="推进要求"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="责任部门：" prop="department">
                  <el-input v-model="item.department" placeholder="责任部门"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="完成时限：" prop="successTime">
                  <el-date-picker type="date" v-model="item.successTime" placeholder="选择日期" value-format="yyyy-MM-dd">
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>
          </div>
          <!-- 立项审批end -->
          <!-- 其他事项 -->
          <el-col :span="8">
            <el-form-item label="其他事项阶段开始时间：" prop="startTime">
              <el-date-picker v-model="formInfo.tProjectFlows[4].startTime" type="date" placeholder="选择日期"
                value-format="yyyy-MM-dd">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="其他事项阶段结束时间：" prop="endTime">
              <el-date-picker v-model="formInfo.tProjectFlows[4].endTime" type="date" placeholder="选择日期"
                value-format="yyyy-MM-dd">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="是否存在堵点：" prop="isPoint5">
              <el-select v-model="formInfo.isPoint5" placeholder="请选择" @change="changeFive">
                <el-option label="是" value="yes"></el-option>
                <el-option label="否" value="no"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <div v-if="formInfo.tProjectFlows[4].tProjectFlowStopList &&
            formInfo.tProjectFlows[4].tProjectFlowStopList.length > 0
            " class="point-box">
            <el-button size="small" style="margin-top: 10px" type="primary" @click="addPoint('5')">新增堵点</el-button>
            <el-row v-for="(item, index) in formInfo.tProjectFlows[4]
              .tProjectFlowStopList" :key="`row${index}`" class="point-box-item" :gutter="20">
              <el-col :span="24">
                <el-form-item prop="content">
                  <div slot="label" class="form-point-label">
                    <span>{{ `赌点${index + 1}` }}</span>
                    <span @click="removePoint('5', index)" class="delete-point"><i class="el-icon-delete"></i>删除</span>
                  </div>
                  <el-input v-model="item.content" placeholder="赌点"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="推进要求：" prop="requirements">
                  <el-input v-model="item.requirements" placeholder="推进要求"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="责任部门：" prop="department">
                  <el-input v-model="item.department" placeholder="责任部门"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="完成时限：" prop="successTime">
                  <el-date-picker type="date" v-model="item.successTime" placeholder="选择日期" value-format="yyyy-MM-dd">
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>
          </div>
          <!-- 其他事项end -->
          <!-- 开工 -->
          <el-col :span="8">
            <el-form-item label="开工阶段开始时间：" prop="startTime">
              <el-date-picker v-model="formInfo.tProjectFlows[5].startTime" type="date" placeholder="选择日期"
                value-format="yyyy-MM-dd">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="开工阶段结束时间：" prop="endTime">
              <el-date-picker v-model="formInfo.tProjectFlows[5].endTime" type="date" placeholder="选择日期"
                value-format="yyyy-MM-dd">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="是否存在堵点：" prop="isPoint6">
              <el-select v-model="formInfo.isPoint6" placeholder="请选择" @change="changeSix">
                <el-option label="是" value="yes"></el-option>
                <el-option label="否" value="no"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <div v-if="formInfo.tProjectFlows[5].tProjectFlowStopList &&
            formInfo.tProjectFlows[5].tProjectFlowStopList.length > 0
            " class="point-box">
            <el-button size="small" style="margin-top: 10px" type="primary" @click="addPoint('6')">新增堵点</el-button>
            <el-row v-for="(item, index) in formInfo.tProjectFlows[5]
              .tProjectFlowStopList" :key="`row${index}`" class="point-box-item" :gutter="20">
              <el-col :span="24">
                <el-form-item prop="content">
                  <div slot="label" class="form-point-label">
                    <span>{{ `赌点${index + 1}` }}</span>
                    <span @click="removePoint('6', index)" class="delete-point"><i class="el-icon-delete"></i>删除</span>
                  </div>
                  <el-input v-model="item.content" placeholder="赌点"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="推进要求：" prop="requirements">
                  <el-input v-model="item.requirements" placeholder="推进要求"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="责任部门：" prop="department">
                  <el-input v-model="item.department" placeholder="责任部门"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="完成时限：" prop="successTime">
                  <el-date-picker type="date" v-model="item.successTime" placeholder="选择日期" value-format="yyyy-MM-dd">
                  </el-date-picker>
                </el-form-item>
              </el-col>
            </el-row>
          </div>
          <!-- 开工end -->
        </el-row>
        <el-form-item>
          <div class="save-btn">
            <el-button size="small" type="primary" @click="handleSubmit('formInfo')">保存</el-button>
          </div>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>
<script>
import topImg from "@img/project/icon-xmgl4.png";
import {
  createKeyProject,
  updatelKeyProject,
  detailKeyProject,
} from "@/api/projectManaApi";
const obj = {
  content: "",
  requirements: "",
  department: "",
  successTime: "",
};
const flows = [
  {
    processSchedule: "洽谈",
    startTime: "",
    endTime: "",
    tProjectFlowStopList: [],
  },
  {
    processSchedule: "签约",
    startTime: "",
    endTime: "",
    tProjectFlowStopList: [],
  },
  {
    processSchedule: "土地手续",
    startTime: "",
    endTime: "",
    tProjectFlowStopList: [],
  },
  {
    processSchedule: "立项审批",
    startTime: "",
    endTime: "",
    tProjectFlowStopList: [],
  },
  {
    processSchedule: "其他事项",
    startTime: "",
    endTime: "",
    tProjectFlowStopList: [],
  },
  {
    processSchedule: "开工",
    startTime: "",
    endTime: "",
    tProjectFlowStopList: [],
  },
];
export default {



  name: "keyProjectTemp",
  props: ["curId"],
  data() {
    return {
      topImg: topImg,
      formInfo: {
        projectName: "",
        projectLeader: "",
        leadingDepartment: "",
        investmentEntity: "",
        totalMoney: "",
        floorSpace: "",
        projectIntroduce: "",
        constructionAddress: "",
        policyStatement: "",
        investmentCommitment: "",
        projectProgress: "",
        isPoint1: "",
        isPoint2: "",
        isPoint3: "",
        isPoint4: "",
        isPoint5: "",
        isPoint6: "",
        tProjectFlows: flows,
      },
      formBoxHeight: document.body.clientHeight - 250,
      rules: {
        projectName: [
          { required: true, message: "请输入项目名称", trigger: "blur" },
        ],
        projectLeader: [
          { required: true, message: "请输入包联领导", trigger: "blur" },
        ],
        leadingDepartment: [
          { required: true, message: "请输入牵头部门", trigger: "blur" },
        ],
        investmentEntity: [
          { required: true, message: "请输入投资主体", trigger: "blur" },
        ],
      },
      projectName: "新增项目",
    };
  },
  created() {
    if (this.curId) {
      this.initData(this.curId);
    }
  },
  mounted() {
    window.addEventListener(
      "resize",
      () => {
        this.formBoxHeight = document.body.clientHeight - 240;
      },
      false
    );
  },
  methods: {
    async initData(id) {
      const res = await detailKeyProject(id);
      if (res.id) {
        this.projectName = res.projectName;
        this.formInfo = { ...this.formInfo, ...res };
        if (!this.formInfo.tProjectFlows) {
          this.formInfo.tProjectFlows = flows;
        }
        this.formInfo.tProjectFlows = this.formInfo.tProjectFlows.map(
          (item) => {
            if (!item.tProjectFlowStopList) {
              item.tProjectFlowStopList = [];
            }
            return item;
          }
        );
      }
      console.log(res);
    },
    // 返回
    goBack(type) {
      this.formInfo = {
        projectName: "",
        projectLeader: "",
        leadingDepartment: "",
        investmentEntity: "",
        totalMoney: "",
        floorSpace: "",
        projectIntroduce: "",
        constructionAddress: "",
        policyStatement: "",
        investmentCommitment: "",
        projectProgress: "",
        isPoint1: "",
        isPoint2: "",
        isPoint3: "",
        isPoint4: "",
        isPoint5: "",
        isPoint6: "",
        tProjectFlows: [
          {
            processSchedule: "洽谈",
            startTime: "",
            endTime: "",
            tProjectFlowStopList: [],
          },
          {
            processSchedule: "签约",
            startTime: "",
            endTime: "",
            tProjectFlowStopList: [],
          },
          {
            processSchedule: "土地手续",
            startTime: "",
            endTime: "",
            tProjectFlowStopList: [],
          },
          {
            processSchedule: "立项审批",
            startTime: "",
            endTime: "",
            tProjectFlowStopList: [],
          },
          {
            processSchedule: "其他事项",
            startTime: "",
            endTime: "",
            tProjectFlowStopList: [],
          },
          {
            processSchedule: "开工",
            startTime: "",
            endTime: "",
            tProjectFlowStopList: [],
          },
        ],
      };
      this.$emit("switchDom", type);
    },
    addPoint(type) {
      if (type === "1") {
        this.formInfo.tProjectFlows[0].tProjectFlowStopList.push(obj);
      }
      if (type === "2") {
        this.formInfo.tProjectFlows[1].tProjectFlowStopList.push(obj);
      }
      if (type === "3") {
        this.formInfo.tProjectFlows[2].tProjectFlowStopList.push(obj);
      }
      if (type === "4") {
        this.formInfo.tProjectFlows[3].tProjectFlowStopList.push(obj);
      }
      if (type === "5") {
        this.formInfo.tProjectFlows[4].tProjectFlowStopList.push(obj);
      }
      if (type === "6") {
        this.formInfo.tProjectFlows[5].tProjectFlowStopList.push(obj);
      }
    },
    removePoint(type, index) {
      if (type === "1") {
        this.formInfo.tProjectFlows[0].tProjectFlowStopList.splice(index, 1);
        if (this.formInfo.tProjectFlows[0].tProjectFlowStopList.length === 0) {
          this.formInfo.isPoint1 = "no";
        }
      }
      if (type === "2") {
        this.formInfo.tProjectFlows[1].tProjectFlowStopList.splice(index, 1);
        if (this.formInfo.tProjectFlows[1].tProjectFlowStopList.length === 0) {
          this.formInfo.isPoint2 = "no";
        }
      }
      if (type === "3") {
        this.formInfo.tProjectFlows[2].tProjectFlowStopList.splice(index, 1);
        if (this.formInfo.tProjectFlows[2].tProjectFlowStopList.length === 0) {
          this.formInfo.isPoint3 = "no";
        }
      }
      if (type === "4") {
        this.formInfo.tProjectFlows[3].tProjectFlowStopList.splice(index, 1);
        if (this.formInfo.tProjectFlows[3].tProjectFlowStopList.length === 0) {
          this.formInfo.isPoint4 = "no";
        }
      }
      if (type === "5") {
        this.formInfo.tProjectFlows[4].tProjectFlowStopList.splice(index, 1);
        if (this.formInfo.tProjectFlows[4].tProjectFlowStopList.length === 0) {
          this.formInfo.isPoint5 = "no";
        }
      }
      if (type === "6") {
        this.formInfo.tProjectFlows[5].tProjectFlowStopList.splice(index, 1);
        if (this.formInfo.tProjectFlows[5].tProjectFlowStopList.length === 0) {
          this.formInfo.isPoint6 = "no";
        }
      }
    },
    checkObjectValues(obj) {
      return Object.values(obj).some(
        (val) => val !== null && val !== undefined && val !== ""
      );
    },
    handleSubmit(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          const data = JSON.parse(JSON.stringify(this.formInfo));
          for (let flow of data.tProjectFlows) {
            if (
              !flow.tProjectFlowStopList ||
              flow.tProjectFlowStopList.length === 0
            ) {
              delete flow.tProjectFlowStopList;
            }
          }
          this.saveData(data);
        } else {
          return false;
        }
      });
    },
    async saveData(data) {
      let res;
      if (this.curId) {
        data.id = this.curId;
        res = await updatelKeyProject(data);
      } else {
        res = await createKeyProject(data);
      }
      if (res.code === 200) {
        this.$confirm("是否返回上一页?", "操作成功", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "success",
        })
          .then(() => {
            this.goBack(true);
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "取消返回",
            });
          });
      } else {
        this.$message({
          type: "error",
          message: res.msg,
        });
      }
    },
    changeOne(val) {
      if (val === "yes") {
        this.formInfo.tProjectFlows[0].tProjectFlowStopList.push(obj);
      } else {
        this.formInfo.tProjectFlows[0].tProjectFlowStopList = [];
      }
    },
    changeTwo(val) {
      if (val === "yes") {
        this.formInfo.tProjectFlows[1].tProjectFlowStopList.push(obj);
      } else {
        this.formInfo.tProjectFlows[1].tProjectFlowStopList = [];
      }
    },
    changeThree(val) {
      if (val === "yes") {
        this.formInfo.tProjectFlows[2].tProjectFlowStopList.push(obj);
      } else {
        this.formInfo.tProjectFlows[2].tProjectFlowStopList = [];
      }
    },
    changeFour(val) {
      if (val === "yes") {
        this.formInfo.tProjectFlows[3].tProjectFlowStopList.push(obj);
      } else {
        this.formInfo.tProjectFlows[3].tProjectFlowStopList = [];
      }
    },
    changeFive(val) {
      if (val === "yes") {
        this.formInfo.tProjectFlows[4].tProjectFlowStopList.push(obj);
      } else {
        this.formInfo.tProjectFlows[4].tProjectFlowStopList = [];
      }
    },
    changeSix(val) {
      if (val === "yes") {
        this.formInfo.tProjectFlows[5].tProjectFlowStopList.push(obj);
      } else {
        this.formInfo.tProjectFlows[5].tProjectFlowStopList = [];
      }
    },
  },
};
</script>
<style scoped lang="less">
.key-project-temp {
  border-radius: 0 0 8px 8px;
  border: 1px solid #e5e5e5;

  .top {
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    background: #e5e5e5;

    .left {
      font-weight: bold;
      font-size: 16px;
    }
  }
}

.form-box {
  padding: 15px;
  overflow-y: auto;

  .grid-title {
    font-weight: bold;
  }

  .el-form-item--mini.el-form-item,
  .el-form-item--small.el-form-item {
    margin-bottom: 10px;
  }

  /deep/.el-form--label-top .el-form-item__label {
    padding: 0;
    width: 100%;
  }
}

.point-box {
  padding: 0 15px 10px 15px;
  box-sizing: border-box;
  border: 1px solid #eee;
  background: #f9f9f9;
  margin: 10px;
  overflow: hidden;

  .point-box-item {
    float: none;
  }

  .form-point-label {
    width: 100%;
    display: flex;
    justify-content: space-between;
  }

  .delete-point:hover {
    cursor: pointer;
    color: red;
  }
}

.save-btn {
  width: 100%;
  text-align: center;
  margin-top: 20px;
}
</style>
